<template>
  <div class="analysis-container">
    <div class="year-selector" style="margin: 20px 0; text-align: center;">
      <a-form-model-item label="全局年度选择" style="display: inline-block; margin-right: 10px;">
        <j-dict-select-tag type="list" v-model="selectedYear" :dictCode="yearDictCode" placeholder="请选择年度"
          @change="handleYearChange" />
      </a-form-model-item>
    </div>
    <IndexChart />
    <IndexTask />
    <IndexBdc />
  </div>
</template>
<script>
import { mapState, mapActions } from 'vuex'
export default {
  name: "Analysis",
  data() {
    return {
      indexStyle: 1,
      yearDictCode: 'year'
    }
  },
  computed: {
    ...mapState({
      globalYear: state => state.app.globalYear
    }),
    selectedYear: {
      get() {
        return this.globalYear
      },
      set(value) {
        this.updateGlobalYear(value)
      }
    }
  },
  created() {
    this.initYearDict() // 初始化年度选项（含年一上/年二上）
  },
  methods: {
    ...mapActions(['updateGlobalYear']),
    handleYearChange(year) {
      console.log('全局年度已切换为：', year)
      // 可添加刷新图表、重新请求数据等逻辑
    },
    initYearDict() {
      const currentYear = new Date().getFullYear()
      const years = []
      // 生成当前年+后5年，每年包含“年一上”“年二上”
      for (let i = 0; i <= 5; i++) {
        const yearNum = currentYear + i
        years.push(
          { value: `${yearNum}年一上`, text: `${yearNum}年一上` },
          { value: `${yearNum}年二上`, text: `${yearNum}年二上` }
        )
      }
      // 缓存年度字典到全局，避免重复生成
      this.$dict.setDictCache(this.yearDictCode, years)
    }
  }
}
</script>
<style scoped>
.year-selector {
  padding: 10px;
  background: #f5f5f5;
  border-radius: 4px;
}
</style>